Skip to content

Feat: add option to set default theme in _config.vivia.yml#65

Open
JoeyC-Dev wants to merge 5 commits intosaicaca:mainfrom
JoeyC-Dev-forks:default-theme-patch
Open

Feat: add option to set default theme in _config.vivia.yml#65
JoeyC-Dev wants to merge 5 commits intosaicaca:mainfrom
JoeyC-Dev-forks:default-theme-patch

Conversation

@JoeyC-Dev
Copy link
Copy Markdown
Contributor

@JoeyC-Dev JoeyC-Dev commented Feb 13, 2024

Feature: Allow user to set the default theme to light/dark, or use auto to auto switch theme based on user's system theme, when user visiting the blog for the first time.
Note: If user never clicked on theme-switch button in auto mode, then it will always follow system theme.

Tested option: light, dark, auto, random_string, and commented it out.

Justification:
Instead of reading values from _config.vivia.yml and directly apply it in the ejs, this will prevent code injection from yml file.

Additional:
After consideration, I add "fix the theme to light/dark once being set" behavior in auto mode, which I believe is better for user experience. Or the light/dark switch button will be useless since user needs to switch pages.

Code difference:

function autoTheme() {
    let root = document.documentElement;
    let theme = localStorage.getItem('theme');
    if (theme) {
        root.setAttribute('theme', theme);
    } else {
    window.matchMedia('(prefers-color-scheme: light)').matches ? root.setAttribute('theme', 'light') : root.setAttribute('theme', 'dark');
    }
};
autoTheme();
function autoTheme() {
    let root = document.documentElement;
    window.matchMedia('(prefers-color-scheme: light)').matches ? root.setAttribute('theme', 'light') : root.setAttribute('theme', 'dark');
};
autoTheme();

@JoeyC-Dev JoeyC-Dev changed the title Add option to set default theme in _config.vivia.yml Feat: add option to set default theme in _config.vivia.yml Feb 18, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant